﻿@model Zor_Web.Models.Systems.V_Roles
@using Webdiyer.WebControls.Mvc;
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>角色管理</title>
    <link href="~/Content/LayerUI/src/css/layui.css" rel="stylesheet" />
    <link href="~/Content/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
    <!-- Main -->
    <div class="layui-tab layui-tab-brief main-tab-container ">

        <div class="layui-tab-content">
            <button class="layui-btn layui-btn-normal layui-btn-small demo" id="addd" data-type="新增角色"><i class="layui-icon">&#xe654;</i> 新 增 </button>
            <button class="layui-btn layui-btn-warm layui-btn-small demo" data-type="编辑角色"><i class="layui-icon">&#xe642;</i> 编 辑 </button>
            <button class="layui-btn layui-btn-danger layui-btn-small" lay-submit lay-filter="delete"><i class="layui-icon">&#xe640;</i> 删 除 </button>
            <button class="layui-btn layui-btn-danger layui-btn-small allot" lay-submit lay-filter="Assign"><i class="layui-icon">&#xe640;</i> 分配权限 </button>
        </div>

        <div class="layui-tab-content ">
            <form class="layui-form">
                <table class="layui-table" lay-skin="line">
                    <thead>
                        <tr>
                            <th><input name="checkAll" lay-filter="checkAll" type="checkbox" lay-skin="primary"></th>
                            <th>角色名称</th>
                        </tr>
                    </thead>
                    <tbody id="accordion">
                        @foreach (var item in Model.PageData)
                        {
                            <tr>
                                <td><input name="" lay-skin="primary" role-id="@item.Roles_Id" role-name="@item.Role_Name" lay-filter="checkOne" type="checkbox"></td>
                                <td>@item.Role_Name</td>
                            </tr>
                        }
                    </tbody>
                </table>

            </form>
        </div>

    </div>

    <!-- Mode -->
    <div id="add_edit" style="display: none;padding: 20px;">
        <form class="layui-form">
            <div class=" layui-form-item">
                <label class="layui-form-label">角色名称</label>
                <div class="layui-input-block">
                    <input type="text" id="Role_Name" lay-verify="ver_RoleName" autocomplete="off" placeholder="请输入角色名称" class="layui-input">
                    <input type="text" id="Roles_Id" hidden>
                </div>
            </div>


            <div class="layui-form-item" style="text-align: right;">
                <div class="layui-btn layui-btn-normal" lay-submit lay-filter="btnAddRole">提 交</div>
            </div>
        </form>
    </div>
    <!-- Mode2 -->
    <div id="add_menu" style="display: none;padding: 20px;">
        <form class="layui-form">
            @foreach (var mu in Model.lstMenu)
            {
                if (mu.Nav_Level == 0)
                {
                    <blockquote class="layui-elem-quote">
                        <legend>@mu.Nav_Title</legend>
                        @foreach (var cbk in Model.lstMenu)
                        {
                            if (cbk.Nav_ParentID == mu.Nav_Id)
                            {
                                <input name="cbk" lay-filter='cbkMenu' value="@cbk.Nav_Id" id="@cbk.Nav_Id" title="@cbk.Nav_Title" type="checkbox">
                            }
                        }
                    </blockquote>
                }
            }

            <div class="layui-form-item" style="text-align: right;">
                <div class="layui-btn layui-btn-normal" lay-submit lay-filter="btnAssign">提 交</div>
            </div>
        </form>
    </div>

    <script src="~/Content/Zor/Scripts/zor_base.js"></script>
    <script src="~/Content/LayerUI/src/layui.js"></script>
    <script type="text/javascript">
        layui.use(['element', 'layer', 'form'], function () {
            var element = layui.element()
            , jq = layui.jquery
            , form = layui.form();


            /**
             * 全选
             */
            form.on('checkbox(checkAll)', function (data) {
                if (data.elem.checked) {
                    jq("input[type='checkbox']").prop('checked', true);
                } else {
                    jq("input[type='checkbox']").prop('checked', false);
                }
                form.render('checkbox');
            });

            /**
             * 监听提交 - 删除
             */
            form.on('submit(delete)', function (data) {
                //判断是否有选项
                var ary = new Array();
                jq("input[lay-filter='checkOne']").each(function () {
                    if (jq(this).prop('checked')) {
                        var ckindex = jq(this).attr('Role-id');
                        ary.push(ckindex);
                    }
                });
                if (ary.length == 0) {
                    layer.msg('请选择要删除的角色！');
                    return false;
                }
                //确认删除
                layer.confirm('确定批量删除角色?', function (index) {
                    loading = layer.load();
                    jq.ajax({
                        type: 'POST',
                        url: '/Systems/DeleteRoles',
                        contentType: "application/json",
                        dataType: "json",
                        data: JSON.stringify({ 'id': ary }),
                        success: function (jsonResult) {
                            if (jsonResult.AnswerType == 1) {
                                layer.close(loading);
                            }
                            layer.msg(jsonResult.AnswerMeg, function () {
                                Replace();
                            });
                        }
                    });
                });
                return false;
            });

            /**
             * 显示弹出框 - 增加、修改
             */
            jq('.demo').on('click', function () {
                var type = jq(this).data('type');

                if (type == '编辑角色') {
                    var ary = check(jq);
                    if (ary.length > 1) {
                        layer.msg('一次只能编辑一条信息，请重新选择！');
                        return;
                    } else if (ary.length == 0) {
                        layer.msg('请选择要编辑的角色！');
                        return;
                    }
                }


                layer.open({
                    title: type,
                    type: 1,
                    skin: 'layui-layer-rim',
                    area: ['500px', '220px'],
                    content: jq('#add_edit'),
                    success: function () {
                        if (type == '编辑角色') {
                            jq('#Roles_Id').val(ary[0].id);
                            jq('#Role_Name').val(ary[0].name);
                        }
                        else {
                            jq('#Role_Name').val('');
                            jq('#Roles_Id').val('');
                        }

                    }
                });
            })


            /**
             * 监听提交 - 增加
             */
            form.on('submit(btnAddRole)', function (data) {
                var jsonData = GetWebControls(add_edit, jq)
                loading = layer.load();
                jq.ajax({
                    type: 'POST',
                    url: '/Systems/AddRoles',
                    contentType: "application/json",
                    dataType: "json",
                    data: JSON.stringify({ 'roles': jsonData }),
                    success: function (data) {
                        if (data.AnswerType == 1) {
                            layer.close(loading);
                        }
                        layer.msg(data.AnswerMeg, function () {
                            Replace();
                        });
                    }
                });
            })


            /**
             * 分配权限 - 显示菜单模态
             */
            jq('.allot').on('click', function () {

                var ary = check(jq);
                if (ary.length > 1) {
                    layer.msg('一次只能分配单个角色的权限，请重新选择！');
                    return false;
                } else if (ary.length == 0) {
                    layer.msg('请选择要分配的角色！');
                    return false;
                }

                //重置选择框
                jq("input[lay-filter='cbkMenu']").each(function () {
                    jq(this).prop('checked', false);
                });
                form.render('checkbox');


                layer.open({
                    title: '分配权限',
                    type: 1,
                    skin: 'layui-layer-rim',
                    area: ['600px', '500px'],
                    content: jq('#add_menu'),
                    success: function () {

                        var checkRoleId = ary[0].id;

                        jq.ajax({
                            type: 'POST',
                            url: '/Systems/LoadNavigationsMenu',
                            contentType: "application/json",
                            dataType: "json",
                            data: JSON.stringify({ 'rolesId': checkRoleId }),
                            success: function (data) {
                                var accordionMenu = data;
                                jq.each(accordionMenu, function (i) {
                                    var menuId = accordionMenu[i].Nav_Id;
                                    jq("#add_menu input[lay-filter='cbkMenu']").each(function () {
                                        var mid = jq(this).val();
                                        if (menuId == mid)
                                            jq(this).prop('checked', true);
                                    });
                                    form.render('checkbox');
                                })
                            }
                        });




                    }
                });
            })


            /**
             * 分配权限 - 执行
             */
            form.on('submit(btnAssign)', function (data) {
                var id = check(jq)[0].id;

                var aryMenu = new Array();
                jq("#add_menu input[lay-filter='cbkMenu']:checked").each(function () {
                    aryMenu.push(jq(this).val());
                });

                loading = layer.load();
                jq.ajax({
                    type: 'POST',
                    url: '/Systems/AssignPermissions',
                    contentType: "application/json",
                    dataType: "json",
                    data: JSON.stringify({ 'menuId': aryMenu, 'rolesId': id }),
                    success: function (data) {
                        if (data.AnswerType == 1) {
                            layer.close(loading);
                        }
                        layer.msg(data.AnswerMeg, function () {
                            Replace();
                        });
                    }
                });

            })

            /*
             * 规则校验
             */
            form.verify({
                ver_RoleName: function (value) {
                    if (value.length < 1)
                        return '请输入角色名称';
                }
            });

            /*
             * 返回 选择行的值
             */
            function check() {
                var ary = new Array();
                jq("input[lay-filter='checkOne']").each(function () {
                    if (jq(this).prop('checked')) {
                        var ckindex = jq(this).attr('role-id');
                        var ckName = jq(this).attr('role-name');
                        ary.push({ id: ckindex, name: ckName });
                    }
                });
                return ary;
            }

        });

    </script>

</body>


</html>
